/*   Copyright 2012 Fernando Moreno Ruiz All Rights Reserved.
 *
 * 	 This file is part of pyPhotosMixer.
 *
 *   pyPhotosMixer is free software: you can redistribute it and/or modify
 *   it under the terms of the GNU General Public License as published by
 *   the Free Software Foundation, either version 3 of the License, or
 *   (at your option) any later version.
 *
 *   pyPhotosMixer is distributed in the hope that it will be useful,
 *   but WITHOUT ANY WARRANTY; without even the implied warranty of
 *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *   GNU General Public License for more details.
 *
 *   You should have received a copy of the GNU General Public License
 *   along with pyPhotosMixer.  If not, see <http://www.gnu.org/licenses/>.
 * */
import QtQuick 1.0

/*
    This component is a dinamic button
*/
Rectangle {
    id: button
    width: img.sourceSize.width
    height: img.sourceSize.height
    state: "Inactive"
    color: "#00000000"
    /*
        Properties
    */
    property string text: ""
    property variant textColorActive: "#00000000"
    property variant textColorInactive: "#00000000"
    property variant textColorDisabled: "#00000000"
    property variant styleColorActive: "#00000000"
    property variant styleColorInactive: "#00000000"
    property variant styleColorDisabled: "#00000000"
    property string fontFamily: ""
    property bool fontBold: false
    property int fontPixelSize: 15
    property real fontLetterSpacing: 0
    property int textMargin: 5
    property variant horizAligment: Text.AlignHCenter

    // size of border of button (to have more space clicking)
    property int spaceBorderClick: 0

    //image which one will appear when the button is active
    property string sActiveSource

    //image which one will appear when the button is inactive
    property string sInactiveSource

    // Image that will be shown when button is disabled.
    property string sDisabledSource: sActiveSource

    // Gradient when Button is pressed
    property variant gradientNormal:button.gradient

    // Image that will be shown when button is pressed.
    property string sPressedSource: ""

    // Gradient when Button is pressed
    property variant gradientPressed

    // set if you clicked it hold on until you click again. Then it will be off.
    property bool bCheckedBehaviour: false

    // set where the image is aligned (values: "Center", "Right", "Left")
    property string imageAlign: "Center"

    // it gets focus of application when the button is pressed
    property bool bGetFocus: true

    //time fading button
    property int timeFade: 200

    //enable button
    property bool clickEnabled: true

    //is menu button. Doesn't have press event, only click!
    property bool menuButton: false


    /*
        Signals
     */
    signal buttonClicked()
    signal buttonPressed()
    signal buttonReleased()

    /*
        Functions
     */
    // Module debug
    property bool debug: false
    function gDebug(txt) {
        if(debug) console.debug(">>> Button.qml :: " + txt);
    }

    function activate(){
        button.state = "Active"
    }
    function desactivate(){
        button.state = "Inactive"
    }
    function activateClick(){
        button.state = "Active"
        buttonClicked()
    }
    function desactivateClick(){
        button.state = "Inactive"
        buttonReleased()
    }
    function isActivate(){
        return button.state === "Active"
    }

    onSActiveSourceChanged: {
        if (sPressedSource == "") sPressedSource = sActiveSource;
    }

    onClickEnabledChanged: {
        state = (clickEnabled ? "Inactive" : "Disabled")
    }

    Item{
        anchors.fill: parent

        /*
            Components
         */
        Image {
            id: img
            width: sourceSize.width
            height: sourceSize.height
            anchors.left: if(imageAlign == "Left") parent.left
            anchors.right: if(imageAlign == "Right") parent.right
            anchors.horizontalCenter: if(imageAlign == "Center") parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
            source: sInactiveSource
            opacity: 1
        }

        Text{
            id: _textInactive
            text: button.text
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            width: parent.width - textMargin
            elide: Text.ElideRight
            horizontalAlignment: horizAligment
            color: textColorInactive
            font.family: fontFamily
            font.bold: fontBold
            font.pixelSize: fontPixelSize
            font.letterSpacing: fontLetterSpacing
            style: Text.Sunken
            styleColor: styleColorInactive
        }
        Text{
            id: _textActive
            text: button.text
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            width: parent.width - textMargin
            elide: Text.ElideRight
            opacity: 0
            horizontalAlignment: horizAligment
            color: textColorActive
            font.family: fontFamily
            font.bold: fontBold
            font.pixelSize: fontPixelSize
            font.letterSpacing: fontLetterSpacing
            style: Text.Raised
            styleColor: styleColorActive
        }
        Text {
            id: _textDisabled
            text: button.text
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            width: parent.width - textMargin
            elide: Text.ElideRight
            color: textColorDisabled
            opacity: 0
            horizontalAlignment: horizAligment
            font.family: fontFamily
            font.bold: fontBold
            font.pixelSize: fontPixelSize
            font.letterSpacing: fontLetterSpacing
            style: Text.Sunken
            styleColor: styleColorDisabled
        }
    }

    MouseArea {
        id: mousearea1
        width: parent.width + spaceBorderClick
        height: parent.height + spaceBorderClick
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.verticalCenter: parent.verticalCenter

        /*
            Signals Handler
         */
        onClicked: {
            if(clickEnabled){
                if(bCheckedBehaviour) {
                    if(button.state == "Inactive") {
                        button.state = "Active";
                    }else{
                        button.state = "Inactive";
                    }
                }
                if(bGetFocus) {
                    focus = true;
                }
                buttonClicked()
            }
        }

        onPressed: {
            if(clickEnabled){
                if(!menuButton){
                    if (button.state == "Inactive") {
                        button.state = "PressedInactive";
                    }
                    else {
                        button.state = "PressedActive";
                        console.log("entra")
                    }
                }
                button.gradient= gradientPressed
            buttonPressed()
            }
        }

        onReleased: {
            if(clickEnabled){
                if (button.state == "PressedInactive") {
                    button.state = "Inactive";
                }
                else {
                    if(!menuButton)
                        button.state = "Active";
                }
                button.gradient= gradientNormal
                buttonReleased()
            }
        }

        onCanceled: {
            if(!bCheckedBehaviour) {
                button.state = "Inactive";
            }
            buttonReleased()
            button.gradient= gradientNormal
        }
    }

    /*
        States
    */
    states: [
        State {
            name: "Active"
            PropertyChanges { target: img; source: sActiveSource }
            PropertyChanges { target: _textActive; opacity: 1 }
            PropertyChanges { target: _textInactive; opacity: 0 }
            PropertyChanges { target: _textDisabled; opacity: 0 }
        },
        State {
            name: "Inactive"
            PropertyChanges { target: img; source: sInactiveSource }
            PropertyChanges { target: _textActive; opacity: 0 }
            PropertyChanges { target: _textInactive; opacity: 1 }
            PropertyChanges { target: _textDisabled; opacity: 0 }
        },
        State {
            name: "PressedActive"
            PropertyChanges { target: img; source: sPressedSource }
            PropertyChanges { target: _textActive; opacity: 0 }
            PropertyChanges { target: _textInactive; opacity: 1 }
            PropertyChanges { target: _textDisabled; opacity: 0 }
        },
        State {
            name: "PressedInactive"
            PropertyChanges { target: img; source: sPressedSource }
            PropertyChanges { target: _textActive; opacity: 1 }
            PropertyChanges { target: _textInactive; opacity: 0 }
            PropertyChanges { target: _textDisabled; opacity: 0 }
        },
        State {
            name: "Disabled"
            PropertyChanges { target: img; source: sDisabledSource }
            PropertyChanges { target: _textActive; opacity: 0 }
            PropertyChanges { target: _textInactive; opacity: 0 }
            PropertyChanges { target: _textDisabled; opacity: 1 }
        }
    ]

    Behavior on opacity {
        NumberAnimation { duration: timeFade }
    }
}
